<template>
  <h1>未做种文件</h1>
  <el-row>
    <el-col :span="24" style="padding-top:20px;padding-bottom: 20px;">
      <el-button type="primary" @click="getFiles">获取(刷新)文件</el-button>
    </el-col>
    <el-col :span="18"></el-col>
  </el-row>
  <el-row>
    <el-col :span="24">
      <el-form :model="form">
        <el-table :data="form.tableData" v-loading="form.loading" :stripe="true" border>
          <el-table-column label="文件名">
            <template #default="scope">
              {{scope.row.filename}}
              <el-button type="primary" size="small" @click="copyFilename(scope.row.filename)" >复制</el-button>
            </template>
          </el-table-column>
          <el-table-column label="是否合集">
            <template #default="scope">
              <el-button type="primary" size="small" v-if="scope.row.is_complete">是</el-button>
              <el-button type="warning" size="small" v-if="!scope.row.is_complete">否</el-button>
            </template>
          </el-table-column>
          <el-table-column label="来源">
            <template #default="scope">
              <el-select v-model="scope.row.source_id">
                <el-option label="HDTV" value="5" />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="分类">
             <template #default="scope">
               <el-select v-model="scope.row.category_id">
                 <el-option label="电影" value="419"></el-option>
                 <el-option label="综艺" value="402"></el-option>
                 <el-option label="体育" value="407"></el-option>
                 <el-option label="纪录片" value="404"></el-option>
                 <el-option label="单集剧集" value="402"></el-option>
               </el-select>
            </template>
          </el-table-column>
          <el-table-column label="">
             <template #default="scope">
               标题<el-input v-model="scope.row.name_chs"></el-input>
               副标题<el-input v-model="scope.row.sub_title"></el-input>
               标题前缀<el-input v-model="scope.row.name_prefix"></el-input>
               英文名<el-input v-model="scope.row.name_eng"></el-input>
            </template>
          </el-table-column>
<!--          <el-table-column label="副标题">-->
<!--             <template #default="scope">-->
<!--               <el-input v-model="scope.row.sub_title"></el-input>-->
<!--            </template>-->
<!--          </el-table-column>-->
<!--          <el-table-column label="标题前缀">-->
<!--             <template #default="scope">-->
<!--               <el-input v-model="scope.row.name_prefix"></el-input>-->
<!--            </template>-->
<!--          </el-table-column>-->
          <el-table-column label="年份">
             <template #default="scope">
               <el-input v-model="scope.row.year"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="豆瓣ID">
             <template #default="scope">
               <el-input v-model="scope.row.dou_ban_id"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="剧集">
             <template #default="scope">
               <el-input v-model="scope.row.season"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="操作">
             <template #default="scope">
               <el-button type="primary" @click="publish(scope.$index)">提交</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
    </el-col>
  </el-row>

    <el-row>
    <el-col :span="24" style="padding-top:20px">
      <el-button type="primary" @click="getFiles">获取(刷新)文件</el-button>
    </el-col>
    <el-col :span="18"></el-col>
  </el-row>
</template>
<script lang="ts" setup>
import { reactive,ref } from 'vue'
import axios from 'axios'
import {ElMessage} from 'element-plus'
import { copyText } from 'vue3-clipboard'


const host = ""

const token = ref("")

// do not use same name with ref
const form = reactive(<any>{
  loading: false,
  tableData:[],
})

const toggleLoading = function (){
  form.loading = !form.loading
}

const publish = async function (index: any){
  toggleLoading()
  try {
    let response = await axios.post(host+'/api/v1/at/publish',
        form.tableData[index],
        {
          timeout: 1000 * 600,
          headers: {'token': token.value}
        }
    );
    if (response.status !== 200){
      ElMessage.error("服务器返回错误")
      return;
    }
    let ret = response.data;
    if (ret.code !== 0){
      ElMessage.error(ret.message)
      return;
    }
    ElMessage.success("操作成功");
    form.tableData.splice(index,1);
  } catch (e) {
    ElMessage.error("发送请求失败")
  } finally {
    toggleLoading()
  }
}


const getFiles = async function (){
  toggleLoading()
  try {
    let response = await axios.post(host+'/api/v1/at/read-file',JSON.stringify({}),{
      headers: {'token': token.value}
    });
    if (response.status !== 200){
      ElMessage.error("服务器返回错误")
      return;
    }
    let ret = response.data;
    if (ret.code !== 0){
      ElMessage.error(ret.message)
      return;
    }
    form.tableData = []
    for(let i=0; i<ret.data.files.length; i++) {
      form.tableData.push({
        filename: ret.data.files[i].filename,
        path: ret.data.files[i].path,
        source_id: "5",
        category_id: "404",
        name_chs: getDefaultTitle(ret.data.files[i].filename),
        sub_title: getDefaultTitle(ret.data.files[i].filename),
        name_prefix: "CCTV-9",
        dou_ban_id: "",
        season: "",
        year:"",
        name_eng:"",
        is_complete: ret.data.files[i].is_complete,
      })
    }
  } catch (e) {
    console.log(e)
    ElMessage.error("发送请求失败")
  } finally {
    toggleLoading()
  }
}

const getDefaultTitle  = function (name) {
  // 去掉尾巴上的.ts
  if (name.indexOf('.ts') != -1){
    // 是文件
    name = name.slice(0,-3)
  }
  return name
}

const copyFilename = function (name){
  // 去掉尾巴上的.ts
  name = getDefaultTitle(name)
  copyText(name, undefined,function (error){
    if (error) {
      ElMessage.warning(`复制失败: ${error} ！`)
    } else {
      ElMessage.success(`复制成功`)
    }
  })
}

getFiles()
</script>